<!-- 使用说明，<element-html-panel :url.asyc="外部引入的html地址"></element-html-panel>-->
<template>
    <div>
    <mu-circular-progress :size="40" v-if="loading"/>
    <p v-html="html"></p>
    </div>
</template>
<script>

    import httpclient from 'httpclient';
    export default{
        // 使用时请使用 :url.sync=""传值
        props: {
            url: {
                required: true
            }
        },
        data () {
            return {
                loading: false,
                html: ''
            };
        },
        watch: {
            url (value) {
                this.load(value);
            }
        },
        mounted () {
            this.load(this.url);
        },
        methods: {
            load (url) {
                const that = this;
                if (url && url.length > 0) {
                    // 加载中
                    that.loading = true;
                    let param = {
                        accept: 'text/html, text/plain'
                    };
                    httpclient.sendGet(url, param).then((res) => {
                        that.loading = false;
                        console.log(res);
                        // 处理HTML显示
                        that.html = res.data;
                    }).catch(() => {
                        that.loading = false;
                        that.html = '加载失败';
                    });
                }
            }
        }
    };
</script>

<style scoped>

</style>
